<template>
  <div class="cqsfjlb">
    <p class="top">
      <span style="font-weight: 700; font-size: 16px; color: #000">{{ info.residentName }}</span>
      <span style="display: inline-block; margin: 0 20px"
        >证件号：{{ info.idNo }}</span
      >
      <span>填表人：{{ info.createUserId }}</span>
    </p>
    <div class="box">
      <span>项目：</span>
      <el-input
        size="small"
        style="width: 200px"
        v-model="info.项目"
      ></el-input>
    </div>
    <div class="box">
      <span>随访日期：</span>
      <el-date-picker
        v-model="info.visitDate"
        align="right"
        type="date"
        placeholder="选择随访日期"
        :picker-options="pickerOptions"
        size="small"
      >
      </el-date-picker>
    </div>
    <div class="box">
      <span>孕周：</span>
      <el-input size="small" style="width: 200px" v-model="info.gestationalWeeks">
        <template slot="append">周</template>
      </el-input>
      <el-input
        size="small"
        style="width: 200px; margin-left: 10px"
        v-model="info.gestationalWeekPlusDays"
      >
        <template slot="append">天</template>
      </el-input>
    </div>
    <div class="box">
      <span>主诉：</span>
      <el-input
        style="width: 400px; vertical-align: top"
        type="textarea"
        :rows="4"
        placeholder="请输入内容"
        v-model="info.complaints"
      >
      </el-input>
    </div>
    <div class="box">
      <span>体重：</span>
      <el-input size="small" style="width: 200px" v-model="info.weight">
        <template slot="append">kg</template>
      </el-input>
    </div>
    <p style="font-weight: 900; font-size: 14px; color: #000">产科检查</p>
    <div class="box">
      <span>宫底高度：</span>
      <el-input size="small" style="width: 300px" v-model="info.fundalHeight">
        <template slot="append">cm</template>
      </el-input>
    </div>
    <div class="box">
      <span>腹围：</span>
      <el-input size="small" style="width: 300px" v-model="info.abdominalCircumference">
        <template slot="append">cm</template>
      </el-input>
    </div>
    <div class="box">
      <span>胎位：</span>
      <el-input size="small" style="width: 300px" v-model="info.baby">
      </el-input>
    </div>
    <div class="box">
      <span>胎心率：</span>
      <el-input size="small" style="width: 300px" v-model="info.fetalHeartRate">
        <template slot="append">次/分钟</template>
      </el-input>
    </div>
    <div class="box">
      <span>血压：</span>
      <el-input size="small" style="width: 300px" v-model="info.hypertension">
        <template slot="append">mmHg</template>
      </el-input>
      <el-input
        size="small"
        style="width: 300px; margin-left: 10px"
        v-model="info.hypotension"
      >
        <template slot="append">mmHg</template>
      </el-input>
    </div>
    <div class="box">
      <span>血红蛋白：</span>
      <el-input size="small" style="width: 300px" v-model="info.hemoglobin">
        <template slot="append">次/分钟</template>
      </el-input>
    </div>
    <div class="box">
      <span>尿蛋白：</span>
      <el-input size="small" style="width: 300px" v-model="info.urineProtein">
        <template slot="append">次/分钟</template>
      </el-input>
    </div>
    <div class="box">
      <span>其他辅助检查：</span>
      <el-input
        style="width: 400px; vertical-align: top"
        type="textarea"
        :rows="4"
        placeholder="请输入内容"
        v-model="info.other"
      >
      </el-input>
    </div>
    <div class="box">
      <span>分类：</span>
      <el-radio-group v-model="info.category">
        <el-radio label="未见异常" value="1">未见异常</el-radio>
        <el-radio label="异常" value="2">异常</el-radio>
        <el-input
          size="small"
          style="width: 200px"
          v-model="info.categoryValue"
          v-if="info.category == '2'"
        >
        </el-input>
      </el-radio-group>
    </div>
    <div class="box">
      <span>指导：</span>
      <el-checkbox-group v-model="info.guidance" style="display: inline-block;">
        <el-checkbox label="生活方式" value="1"></el-checkbox>
        <el-checkbox label="营养" value="2"></el-checkbox>
        <el-checkbox label="心理" value="3"></el-checkbox>
        <el-checkbox label="运动" value="4"></el-checkbox>
        <el-checkbox label="自我监测" value="5"></el-checkbox>
        <el-checkbox label="母乳喂养" value="6"></el-checkbox>
        <el-checkbox label="分娩准备" value="7"></el-checkbox>
        <el-checkbox label="其他" value="8"></el-checkbox>
        <el-input
          size="small"
          v-model="info.guidanceOther"
          style="width: 150px; margin-right: 10px; margin-left: 10px"
          placeholder="请输入......"
        ></el-input>
      </el-checkbox-group>
    </div>
    <div class="box">
      <span>转诊建议：</span>
      <el-radio-group v-model="info.referral" style="margin-left: 10px">
        <el-radio label="无" value="1">无</el-radio>
        <el-radio label="有" value="2">有</el-radio>
      </el-radio-group>
      <div v-if="info.referral == '2'">
        原因:
        <el-input
        placeholder="请输入"
        v-model="info.referralReason"
        style="width: 200px;"
        size="small"
      >
      </el-input>
      </div>
      <div v-if="info.referral == '2'">
        机构及科室:
        <el-input
        placeholder="请输入"
        v-model="info.referralMedicalId"
        style="width: 200px;"
        size="small"
      >
      </el-input>
      </div>
    </div>
    <div class="box">
      <span>下次随访日期：</span>
      <el-date-picker
        v-model="info.nextDate"
        align="right"
        type="date"
        placeholder="选择下次随访日期"
        :picker-options="pickerOptions"
        size="small"
      >
      </el-date-picker>
    </div>
    <div class="box">
      <span>随访医生签名：</span>
      <el-select
        filterable
        placeholder="请选择随访医生"
        size="small"
        style="width: 200px"
        v-model="info.createUnitId"
      >
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
      <el-select
        filterable
        placeholder="请选择体检医生"
        size="small"
        style="width: 200px; margin-left: 20px"
        v-model="info.createUserId"
      >
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
    </div>
    <div class="box">
      <span>随访照片：</span>
      <el-button
        icon="el-icon-upload2"
        type="primary"
        style="background-color: #fff; color: rgb(46, 160, 254)"
        size="small"
        plain
        >本地上传文件</el-button
      >
      <el-button
        icon="el-icon-picture-outline"
        type="primary"
        style="background-color: #fff; color: rgb(46, 160, 254)"
        size="small"
        plain
        >加载手机图片</el-button
      >
      <p style="margin-top: 10px">
        扫描二维码，在手机端点击"上传"图片，在手机端上传后，点击上方"加载手机照片"按钮，即可同步到电脑端
      </p>
      <div>
        <img
          style="width: 100px"
          src="http://8.218.107.5:9992/media/base/zhengjian/qrcode/16863931874Q68253F.png"
          alt=""
        />
        <img
          style="width: 100px; margin-left: 20px"
          src="http://8.218.107.5:9992/media/base/zhengjian/qrcode/16863931874Q68253F.png"
          alt=""
        />
      </div>
    </div>


  </div>
</template>
          
          <script>
export default {
  data() {
    return {
      info: {
        指导: [],
      },
      options: [
        {
          value: "测试",
          label: "测试",
        },
      ],
      pickerOptions: {
        
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
        ],
      },
      value2: "",
    };
  },
};
</script>
          
          <style scoped lang="scss">
.cqsfjlb {
  .top {
    padding: 10px 20px;
    background-color: #e6f7ff;
    border: 1px solid #91d5ff;
  }
  .tab1 {
    tr {
      width: 100%;
      th {
        text-align: center;
        color: #000;
        background-color: rgb(250, 250, 250);
      }
      td {
        padding: 10px;
      }
    }
  }
  .box {
    padding: 10px 250px;
    background-color: rgb(250, 250, 250);
    margin: 10px 0;
  }
}
</style>